<template>
	<view style="padding: 10px;">
		<!-- 注意，如果需要兼容微信小程序，最好通过setRules方法设置rules规则 -->
		<u--form labelPosition="left" :model="userInfo" :rules="rules" ref="form1" labelWidth="80px">
			<u-form-item label="姓名:" prop="name" borderBottom ref="item1">
				<u--input v-model="userInfo.name" border="none"></u--input>
			</u-form-item>
			<u-form-item label="手机号码:" prop="mobile" borderBottom ref="item1">
				<u--input v-model="userInfo.mobile" border="none"></u--input>
			</u-form-item>
			<u-form-item label="密码:" borderBottom ref="item1">
				<u--text text="密码默认为手机号" border="none"></u--text>
			</u-form-item>
			<u-form-item label="性别:" prop="sex.name" borderBottom @click="showSex = true" ref="item1">
				<u--input v-model="userInfo.sex.name" disabled disabledColor="#ffffff" placeholder="请选择性别"
					border="none"></u--input>
				<u-icon slot="right" name="arrow-right"></u-icon>
			</u-form-item>
			<u-form-item label="客户来源:" prop="source.name" borderBottom @click="showSource = true" ref="item1">
				<u--input v-model="userInfo.source.name" disabled disabledColor="#ffffff" placeholder="请选择客户来源"
					border="none"></u--input>
				<u-icon slot="right" name="arrow-right"></u-icon>
			</u-form-item>
			<u-form-item label="成交状态:" prop="deal.name" borderBottom @click="showDeal = true" ref="item1">
				<u--input v-model="userInfo.deal.name" disabled disabledColor="#ffffff" placeholder="请选择成交状态"
					border="none"></u--input>
				<u-icon slot="right" name="arrow-right"></u-icon>
			</u-form-item>
			<u-form-item label="地区:" prop="address.name" borderBottom ref="item1">
				<pickerAddress @change="change">
					{{userInfo.address}}
				</pickerAddress>
			</u-form-item>
			<u-button type="primary" size="big" text="提交" @click='commit'></u-button>
		</u--form>
		<u-action-sheet :show="showSex" :actions="actions" title="请选择性别" @close="showSex = false" @select="sexSelect">
		</u-action-sheet>
		<u-action-sheet :show="showDeal" :actions="dealactions" title="请选择成交状态" @close="showDeal = false"
			@select="dealSelect">
		</u-action-sheet>
		<u-action-sheet :show="showSource" :actions="sourceactions" title="请选择成交状态" @close="showSource = false"
			@select="sourceSelect">
		</u-action-sheet>
		<u-toast ref="uToast"></u-toast>
	</view>
</template>

<script>
	import pickerAddress from '@/components/hu-pickerAddress/hu-pickerAddress.vue'
	export default {
		components: {
			pickerAddress
		},
		data() {
			return {
				id: '',
				LoginUser: {},
				dealactions: [],
				sourceactions: [],
				showDeal: false,
				showSource: false,
				showSex: false,
				userInfo: {
					name: '',
					mobile: '',
					sex: {
						name: '',
						value: 0,
					},
					password: '',
					source: {
						name: '',
						value: 0,
					},
					deal: {
						name: '',
						value: 0,
					},
					address: "请选择地区",

				},
				actions: [],
				rules: {
					'name': {
						type: 'string',
						required: true,
						message: '请填写姓名',
						trigger: ['blur', 'change']
					},
					'sex.name': {
						type: 'string',
						required: true,
						message: '请填写性别',
						trigger: ['blur', 'change']
					},
					'source.name': {
						type: 'string',
						required: true,
						message: '请填写客户来源',
						trigger: ['blur', 'change']
					},
					'deal.name': {
						type: 'string',
						required: true,
						message: '请填写成交状态',
						trigger: ['blur', 'change']
					},
					'address': {
						type: 'string',
						required: true,
						message: '请填写地区',
						trigger: ['blur', 'change']
					},
					'mobile': [{
							required: true,
							message: '请输入手机号',
							trigger: ['change', 'blur'],
						},
						{
							// 自定义验证函数，见上说明
							validator: (rule, value, callback) => {
								// 上面有说，返回true表示校验通过，返回false表示不通过
								// uni.$u.test.mobile()就是返回true或者false的
								return uni.$u.test.mobile(value);
							},
							message: '手机号码不正确',
							// 触发器可以同时用blur和change
							trigger: ['change', 'blur'],
						}
					]
				},
				radio: '',
				switchVal: false
			};
		},
		onLoad() {
			this.LoginUser = uni.getStorageSync('LoginUser') ? uni.getStorageSync('LoginUser') : {};
			this.getSelect()
		},
		methods: {
			async getSelect(){
				let result= await this.$u.api.business.privateseaSelect();
				console.log(result)
				if(result.code==1){
					this.actions = this.objToArr(result.data.Sexlist)
					this.dealactions = this.objToArr(result.data.Deallist)
					this.sourceactions = this.objToArr(result.data.Sourcdata)
					console.log(this.sourceactions)
				}
			},
			change(data) {
				this.userInfo.address = data.data.join('-')
				// console.log(this.userInfo.value)
			},
			dealSelect(e) {
				// console.log(e)
				this.userInfo.deal.value = e.value;
				this.userInfo.deal.name = e.name;
			},
			sexSelect(e) {
				// console.log(e)
				this.userInfo.sex.value = e.value;
				this.userInfo.sex.name = e.name;
			},
			sourceSelect(e) {
				// console.log(e)
				this.userInfo.source.value = e.value;
				this.userInfo.source.name = e.name;
			},
			objToArr(obj) {
				let arr = []
				for (let key in obj) {
					arr.push({
						name: obj[key],
						value: key
					})
				}
				return arr
			},
			async commit() {
				let _this = this;
				this.$refs.form1.validate().then(async (res) => {
					let data = {
						Adminid: this.LoginUser.id,
						nickname: this.userInfo.name,
						mobile: this.userInfo.mobile,
						gender: this.userInfo.sex.value,
						sourceid: this.userInfo.source.value,
						deal: this.userInfo.deal.value,
						region: this.userInfo.address
					}
					console.log(data)
					let result = await this.$u.api.business.privateseaAdd(data)
					if (result.code === 1) {
						this.$refs.uToast.show({
							type: 'success',
							message: result.msg,
							complete: () => {
								this.$u.route({
							 	type: 'redirectTo',
									url: '/packageB/privatesea/index'
								})
							}
						})
						return false
					} else {
						this.$refs.uToast.show({
							type: 'error',
							message: result.msg,
						})
					
						return false
					}
				})
			
				// console.log(this.userInfo)
		
			}

		},
		onReady() {
			//如果需要兼容微信小程序，并且校验规则中含有方法等，只能通过setRules方法设置规则。
			this.$refs.form1.setRules(this.rules)
		},
	};
</script>
<style>
	scroll-view {}
</style>
